<!-- Nav menu with search -->
<nav class="navbar navbar-inverse pmd-navbar pmd-z-depth">
	<div class="container-fluid">
		<!-- Brand and toggle get grouped for better mobile display -->
		<div class="navbar-header">
			<button class="pmd-ripple-effect navbar-toggle pmd-navbar-toggle" type="button">
				<span class="sr-only">Toggle navigation</span>
				<span class="icon-bar"></span>
				<span class="icon-bar"></span>
				<span class="icon-bar"></span>
			</button>
			<a href="javascript:void(0);" class="navbar-brand">Brand</a>
		</div>
		<div class="pmd-navbar-right-icon pull-right">
			<a class="btn btn-sm pmd-btn-fab pmd-btn-flat pmd-ripple-effect btn-primary" href="javascript:void(0);"><i class="material-icons pmd-sm">search</i></a>
		</div>
		<!-- Collect the nav links, forms, and other content for toggling -->
		<div id="bs-example-navbar-collapse-1" class="collapse navbar-collapse pmd-navbar-sidebar">
		  <ul class="nav navbar-nav navbar-right">
			<li><a class="pmd-ripple-effect" href="javascript:void(0);">Link</a></li>
			<li class="dropdown pmd-dropdown">
			  <a aria-expanded="false" role="button" data-toggle="dropdown" data-sidebar="true" class="pmd-ripple-effect dropdown-toggle" href="javascript:void(0);">Dropdown <span class="caret"></span></a>
			  <ul role="menu" class="dropdown-menu dropdown-menu-right">
				<li><a class="pmd-ripple-effect" href="javascript:void(0);">Action</a></li>
				<li><a class="pmd-ripple-effect" href="javascript:void(0);">Another action</a></li>
				<li><a class="pmd-ripple-effect" href="javascript:void(0);">Something else here</a></li>
				<li class="divider"></li>
				<li><a class="pmd-ripple-effect" href="javascript:void(0);">Separated link</a></li>
			  </ul>
			</li>
		  </ul>
		</div><!-- /.navbar-collapse -->
	</div>
	<div class="pmd-sidebar-overlay"></div>
</nav>